import React, { Component } from 'react'

// export default class MessageDetail extends Component {
//   render() {
//     // return <div> MessageDetail route compoent </div>
//     ;<ul>
//       <li>ID : 6</li>
//       <li>TITLE : Message006</li>
//       <li>CONTENT: I LOVE YOU</li>
//     </ul>
//   }
// }
const allMessage = [
  { id: 1, title: 'message001', content: '小朋友的问号吗' },
  { id: 2, title: 'message002', content: '小朋友问好' },
  { id: 3, title: 'message003', content: '小朋友的朋友' },
]
export default function MessageDetail(props) {
  //   const { id } = props.match.params
  const { id } = props.match.params
  // 查询到对应的Message
  const message = allMessage.find((m) => m.id == id)
  return (
    <ul>
      <li>ID：{message.id}</li>
      <li>TITLE：{message.title}</li>
      <li>CONTENT：{message.content}</li>
    </ul>
  )
}
